<template>
    <view>
        <up-datetime-picker
                :show="show2"
                v-model="value2"
                mode="date"
                @confirm="onConfirm2"
                @cancel="onCancel"
        ></up-datetime-picker>
    </view>
</template>

<script setup>
import { ref, watch } from 'vue';
// 父组件传递的 show 值
const props = defineProps({
    show2: Boolean,
});

// 通过 v-model 双向绑定 show
const emit = defineEmits(['update:show']);

const show2 = ref(props.show2);
const value2 = ref(Date.now());

// 监控 props 的变化并同步到本地变量 show
watch(() => props.show2, (newVal) => {
    show2.value = newVal;
});

// 确认选择日期时触发的函数
const onConfirm2 = () => {
    emit('update:show2', false); // 选择后隐藏日期选择器
    emit('confirm2', value2.value);
};

// 取消时触发的函数
const onCancel = () => {
    emit('update:show', false); // 取消后隐藏日期选择器
};
</script>
